<%--用户的header--%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ include file="/assets/view/base/tag.jsp" %>
<!-- 用户信息大图展示区 -->
<div class="hu-wrap">
    <input id="hi_bcid" type="hidden" value="${user.blogConfig.id}">
    <div id="hu-bg" class="hu-bg" style="background-image: url(${contextPath}${user.blogConfig.handerBg});" handerBg="${user.blogConfig.handerBg}"></div>
    <div class="shadow" layout-shell="false">
        <a id="hbj-btn" href="javascript:void(0);" title="换背景">
            <span  class="hbj-btn corner-right-top"></span>
        </a>
        <div class="u_photo">
            <p class="photo_wrap">
                <img src="<%--${contextPath}--%>${user.headImg}" alt="${user.name}" class="img-circle phpto">
            </p>
        </div>
        <div class="u_username">
            <h1 class="username">${user.name}</h1>
        </div>
        <div class="u_intro" title="${user.sign}">
            ${user.sign}
        </div>
        <div class="u_opt">
            <%--<a class="btn btn-mod btn-gray btn-round" value="关注">关注</a>--%>
        </div>
    </div>
    <div id="hbj-modal" class="modal fade">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                    </button>
                    <h4 class="modal-title text-center">换背景图片<small>点击保存设置</small></h4>
                </div>
                <div id="hbj-notice-warp">

                </div>
                <div class="modal-body row align-center">
                    <div class="col-md-4">
                        <div class="view-warp fifth-effect">
                            <img handerBg="/assets/img/them/u-bg-1.jpg" src="${contextPath}/assets/img/them/u-bg-1.jpg">
                            <div class="mask"></div>
                        </div>
                        <p>勇气</p>
                    </div>
                    <div class="col-md-4">
                        <div class="view-warp fifth-effect">
                            <img handerBg="/assets/img/them/u-bg-2.jpg" src="${contextPath}/assets/img/them/u-bg-2.jpg">
                            <div class="mask"></div>
                        </div>
                        <p>奔跑</p>
                    </div>
                    <div class="col-md-4">
                        <div class="view-warp fifth-effect">
                            <img handerBg="/assets/img/them/u-bg-3.jpg" src="${contextPath}/assets/img/them/u-bg-3.jpg">
                            <div class="mask"></div>
                        </div>
                        <p>映像</p>
                    </div>

                    <div class="col-md-4">
                        <div class="view-warp fifth-effect">
                            <img handerBg="/assets/img/them/u-bg-5.jpg" src="${contextPath}/assets/img/them/u-bg-5.jpg">
                            <div class="mask"></div>
                        </div>
                        <p>高山之巅</p>
                    </div>
                    <div class="col-md-4">
                        <div class="view-warp fifth-effect">
                            <img handerBg="/assets/img/them/u-bg-4.jpg" src="${contextPath}/assets/img/them/u-bg-4.jpg">
                            <div class="mask"></div>
                        </div>
                        <p>迷雾</p>
                    </div>
                </div>
                <%--<div class="modal-footer">
                    <span class="text-info"><span class="icon-exclamation-sign"></span>鼠标移动/点击预览</span>
                    <button class="btn btn-success">保存设置</button>
                </div>--%>
            </div>
        </div>
    </div>
</div>
<!-- 用户导航区 -->
<div class="hn-wrap">
    <nav class="navbar navbar-default">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#hn-navbar-collapse"
                        aria-expanded="false">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <p class="navbar-text"></p>
            </div>
            <!-- 小设备需要隐藏起来的元素 -->
            <div class="collapse navbar-collapse" id="hn-navbar-collapse">
                <ul class="nav">
                    <li><a href="${contextPath}/">HOME</a></li>
                    <li id="menu-list"><a href="${contextPath}/${account}/article/category/all">列表</a></li>
                    <shiro:user>
                        <security:isMasterUser masterAccount='${account}'>
                            <li><a href="/auth/manage/postlist/1">管理中心</a></li>
                        </security:isMasterUser>
                    </shiro:user>
                </ul>
            </div>
        </div>
    </nav>
</div>